import HeaderBar from "../../components/header/HeaderBar";
import LiliFooter from "../../components/footer";
import banner from "../../common/img/infoBackGround.webp";
import avatarImg from "../../common/img/avatar.png";
import { SpacePost } from "../../utils/posts";

import "./space.css";
import { Link } from "react-router-dom";

function Space({ loginAction }) {
  return (
    <div className="owner">
      <HeaderBar subClass={" fixed-header"} loginAction={loginAction} />
      <div className="owner-head">
        <div className="owner-head-wrapper">
          <div className="head-inner" style={{ backgroundImage: `url(${banner})` }}>
            <div className="head-gradient"></div>
            <div className="head-user">
              <div className="head-info">
                <div className="h-avatar-container">
                  <div>
                    <div className="head-avatar" style={{ width: "60px", height: "60px" }}>
                      <img src={avatarImg} alt="" />
                    </div>
                  </div>
                </div>
                <div className="h-basic">
                  <div>
                    <span id="h-name">珑琦Ronki</span>
                  </div>
                  <div className="h-basic-spacing">
                    {/* 占位 */}
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div className="navigator">
        <div className="wrapper">
          <div className="nav-inner">
            <div className="nav-tab-links">
              <Link to="/space" className="nav-btn active" >
                <i className="iconfont icon-ic_home">&#xe660;</i>
                <span className="nav-text">主页</span>
              </Link>
            </div>
          </div>
          <div className="nav-cursor" style={{ width: "50px", left: "20px" }}>

          </div>
        </div>
      </div>
      <div className="s-space">
        <div>
          <div className="wrapper">
            <div className="page">
              <SpacePost />
            </div>
          </div>
        </div>
      </div>
    </div>
  );
}

export default Space;